<template>
  <div>
    <fieldset>
      <legend style="margin-left:-12px;" class="field-title">审批结果</legend>
      <el-form
        :model="auditForm"
        ref="auditForm"
        label-width="120px"
        size="small"
        :rules="rules"
      >
        <el-row>
          <el-col :span="5">
            <el-form-item
              label="审批结果"
              prop="auditResult"
              style="margin-right:20px;"
            >
              <el-select
                placeholder="请选择"
                clearable
                filterable
                v-model="auditForm.auditResult"
                style="width:100%;"
                @change="getPatchRes"
              >
                <el-option
                  v-for="(value, key) of dicts['audit_result'].childMap"
                  :key="key"
                  :label="value"
                  :value="key"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="16" v-if="showPatch">
            <el-form-item label="需补充材料" style="margin-right:20px;">
              <el-select
                placeholder="需补充材料"
                v-model="auditForm.patchList"
                multiple
                clearable
                style="width:100%"
                @change="changePatch"
              >
                <el-option
                  v-for="(value, key) of patchSelect"
                  :key="key"
                  :label="value"
                  :value="key"
                />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="审批意见" prop="auditAdvice">
              <el-input
                v-model="auditForm.auditAdvice"
                placeholder="请输入审批意见"
                maxlength="200"
                show-word-limit
                clearable
                type="textarea"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="">
              <el-button type="danger" style="width:48%" @click="saveData"
                >暂存</el-button
              >
              <el-button type="primary" style="width:48%" @click="submitData"
                >提交</el-button
              >
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </fieldset>
  </div>
</template>

<script>
import api from "../api";
import { CONSTANT_OBJ } from "@/utils/constant";
import { BC_CL, BC_CL2 } from "../js/contant.js";
import { mapState } from "vuex";
import { common } from "@/utils/common";
export default {
  props: {
    productType: {
      type: String,
      default: ""
    }
  },
  data() {
    return {
      BC_CL,
      BC_CL2,
      auditForm: {
        auditResult: "",
        auditAdvice: "",
        patchList: []
      },
      rules: {
        auditResult: [{ required: true, message: "请选择", trigger: "change" }],
        auditAdvice: [
          { required: true, message: "请输入审批意见", trigger: "blur" }
        ]
        // patchList: [{ required: true, trigger: 'change', validator: this.rulesPatchList }]
      },
      showPatch: false,
      patchSelect: {},
      tempPatch: []
    };
  },
  mounted() {
    this.getLatestAuditData();
    this.filterPatchSelect();
  },
  watch: {
    productType(newVal) {
      if (newVal) {
        this.filterPatchSelect();
      }
    }
  },
  methods: {
    filterPatchSelect() {
      switch (this.productType) {
        case "JYD":
          let temp = {};
          this.dicts["jyd_img_type"].childList.forEach(val => {
            if (this.BC_CL2.includes(val.dictNo)) {
              temp[val.dictNo] = val.dictName;
            }
          });
          this.patchSelect = { ...temp };
          break;
        case "JXD":
          let temp2 = {};
          this.dicts["img_type"].childList.forEach(val => {
            if (this.BC_CL.includes(val.dictNo)) {
              temp2[val.dictNo] = val.dictName;
            }
          });
          this.patchSelect = { ...temp2 };
          break;
      }
    },
    getPatchRes(val) {
      this.showPatch = val === "BACK";
    },
    // 获取最新审批结果
    getLatestAuditData() {
      api.getLatestAuditData(this.approvalData.caseId).then(res => {
        const { responseCode, data } = res;
        if (responseCode === CONSTANT_OBJ.RES_SUCCESS) {
          if (data.auditAction === "SAVE") {
            this.auditForm.auditResult = data.auditResult || "";
            this.auditForm.auditAdvice = data.auditAdvice || "";
          }
        }
      });
    },
    // 保存
    saveData() {
      this.$refs["auditForm"].validate(valid => {
        console.log(this.auditForm, "参数提交");
        if (valid) {
          let data = {
            auditResult: this.auditForm.auditResult,
            auditAdvice: this.auditForm.auditAdvice,
            patchList: [...this.auditForm.patchList],
            caseId: this.approvalData.caseId
          };
          api.postSaveAuditData(data).then(res => {
            console.log(res);
            const { responseCode, responseMsg: message } = res;
            if (responseCode === CONSTANT_OBJ.RES_SUCCESS) {
              this.$message({
                message,
                type: "success"
              });
            }
          });
        }
      });
    },
    submitCheck(data) {
      common.confirmFn(`是否提交审批结果？`, "").then(res => {
        if (res) {
          console.log(data);
          api.postSubmitAuditData(data).then(res => {
            const { responseCode, responseMsg: message } = res;
            if (responseCode === CONSTANT_OBJ.RES_SUCCESS) {
              this.$message({
                message,
                type: "success"
              });
              this.$tabRemove(this.$activeTab);
            }
          });
        }
      });
    },
    // 提交
    submitData() {
      this.$refs["auditForm"].validate(valid => {
        console.log(this.auditForm, "参数提交");
        if (valid) {
          let data = {
            auditResult: this.auditForm.auditResult,
            auditAdvice: this.auditForm.auditAdvice,
            patchList: [...this.auditForm.patchList],
            caseId: this.approvalData.caseId
          };
          this.submitCheck(data);
        }
      });
    },
    changePatch(val) {
      console.log(val, "选中值");
      let arr = val.map(ele => {
        return this.patchSelect[ele];
      });
      this.auditForm.auditAdvice = `需补充 ${arr.join("、")}`;
    }
    // rulesPatchList (rules, value, callback) {
    //   console.log(value, '补件内容')
    //   if (this.showPatch && value.length === 0) {
    //     callback(new Error('需补充资料至少选择一样'))
    //     return false
    //   }
    //   callback()
    // }
  },
  computed: {
    ...mapState({
      approvalData: state => state.approval.approvalData,
      dicts: state => state.common.dicts
    })
  }
};
</script>

<style lang="less" scoped>
@import "../../../assets/css/global.less";
fieldset {
  padding: 0 10px;
  margin-bottom: 10px;
  border-color: @theme-color;
}
.field-title {
  color: @theme-color;
}
</style>
